.manage{
  height: 90%;
  padding-bottom: 20px;
  overflow: hidden;
  &-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
  }
}



// 主题中心
.theme-center{
  ul{
      li{
          float: left;
          width: 100%;
          margin-bottom: 10px;
          span{
              float: left;
              width: 40px;
              height: 40px;
              line-height: 40px;
              &:nth-child(2) {
                  width: auto;
                  margin-left: 20px;
              }
          }
          &:hover{
              cursor: pointer;
          }
      }
  }
  .blue-rect{
      background-color: #4D8CD6;
  }
  .org-rect{
    background-color: #cfdbf3;
  }
  .black-rect{
      background-color: #333333;
  }
  .white-rect{
      background-color: #FFFFFf;
      border: 1px solid #e3e3e3;
      box-sizing: border-box;
  }
}



// 焦点按钮样式
.button-focus{
  background-color: $button_focus_default;
  color: $font_color_button_2;
  border-color: $button_focus_default;
  &:hover{
      background-color: $button_focus_hover;
      color: $font_color_button_2;
      border-color: $button_focus_hover;
  }
  &:active{
      background-color: $button_focus_click;
      color: $font_color_button_2;
      border-color: $button_focus_click;
  }
  &[disabled] {
      background-color: $button_focus_disabled;
      color: $font_color_button_2;
      border-color: $button_focus_disabled;
  }
}

// 重要按钮样式
.button-important{
  background-color: rgba(255,255,255,1);
  color: $button_important_defalut;
  border-color: $button_important_defalut;
  &:hover{
      background-color: rgba(255,255,255,1);
      color: $button_important_hover;
      border-color: $button_important_hover;
  }
  &:active{
      background-color: rgba(255,255,255,1);
      color: $button_important_click;
      border-color: $button_important_click;
  }
  &[disabled] {
      background-color: rgba(255,255,255,1);
      color: $button_important_disabled_font;
      border-color: $button_important_disabled_boder;
  }
}

// el-tree控件的x轴滚动条
.showOverFlow .el-tree-node>.el-tree-node__children {
  overflow: initial;
}

// 普通按钮样式
.button-normal{
  background-color: rgba(255,255,255,1);
  color: $button_normal_defalut_font;
  border-color: $button_normal_defalut_border;
  &:hover{
      background-color: rgba(255,255,255,1);
      color: $button_normal_hover;
      border-color: $button_normal_hover;
  }
  &:active{
      background-color: rgba(255,255,255,1);
      color: $button_normal_click;
      border-color: $button_normal_click;
  }
  &[disabled] {
      background-color: #e8e8e8;
      color: $button_normal_disabled_font;
      border-color: $button_normal_disabled_border;
  }
}

// 辅助样式
.marginLeft{
  margin-left: 12px;
}
.marginRight{
  margin-right: 12px;
}
// 圆
.circle{
  display: inline-block;
  width: 10px;
  height: 10px;
  border-radius: 100%;
}
// 无边框
.border-none {
  &>*{
      border: none !important;
  }
}
// 表格头部筛选 - 选项
.filter-switch{
  .filter-item{
      width: 100%;
      margin-bottom: 5px;
      &:last-child{
          margin-bottom: 0;
      }
  }
}
.global-padding{
  padding:  20px;
}
.global-margin{
  margin:  20px;
}

.floatLeft{
  float: left;
}


.el-main{
  padding: 0;
}

@for $i from 1 through 4 {
  .theme-#{$i} {
      .icon-color{ // 图标颜色
          color: nth($button_focus_default, $i);
      }
      .border-bottom{ // 底部边框颜色
          border-bottom-width: 1px;
          border-bottom-style:  solid;
          border-bottom-color: nth($button_focus_default, $i);
      }
      .green{ // 绿色圆
          @extend .circle;
          background-color: #52c41a;
      }
      .red{ // 红色圆
          @extend .circle;
          background-color: #f5222d;
      }
      .gay{ // 灰色圆
          @extend .circle;
          background-color: #7a7a7a;
      }
      .blue{ // 绿色圆
          @extend .circle;
          background-color: #0b7ee7;
      }
      .font_red{ // 红子、字
          color: #f5222d;
      }
      .border_red{ // 红边框
          border: 1px solid #f5222d !important;
      }
      .orange{ // 橙色圆点
          @extend .circle;
          background-color: #ff782d;
      }
      .orange-font{ // 橙色字
          color: #ff782d;
      }
      .active-button{ // 激活类似button样式
          padding: 9 16px;
          font-size: $font_size_strong;
          color: #fff;
          background-color: nth($button_focus_default, $i);
      }
      .active-link{ // 激活文字链接样式
          color: nth($button_focus_default, $i);
      }
      .selected-down{ // 下拉框的边框与投影
          border: 1px solid nth($selected-dropDown-border, $i);
          box-shadow: 0 0 4px nth($selected-dropDown-shadow, $i);
          background-color: #ffffff;
      }
      .filter-switch .filter-item:hover{ // 表格头部筛选 - 选项鼠标经过背景色
          background-color:  nth($table_color_th_hover, $i);
      }
      .row-color_hover { // 行数据经过样式
          background-color: nth($table_color_th_hover, $i);
      }
      .mock-tbody-tr-hover{ // 模拟tbody行经过样式
          background-color: nth($table_color_th_hover, $i);
      }
  }
}
// 橙色渐变小竖条
.vertical-bar {
    display: inline-block;
    width: 4px;
    height: 10px;
    background: linear-gradient(180deg, #EA8A5E 0%, #D15230 100%);
    line-height: 20px;
}
// 消息提示出现位置
.el-message{
    top:200px!important;
}

// 全屏loading 位置
.el-loading-mask.is-fullscreen .el-loading-spinner {
    margin-top: -200px;
}
// loading 颜色
.el-loading-spinner .path{
    stroke: #485B7c;
}
.el-loading-text{
    color :#485B7c!important;
}

// 右侧弹出消息位置
 .el-notification.right{
    top: 60px!important;
 }